<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>华为专区</title>
    <!-- link:favicon -->
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/commons.css">
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <!-- 快捷导航 -->
    <div class="shortcut">
        <div class="wrapper">
            <ul class="left">
            
                <li><a href="#">华为官网</a>|</li>
            
                <li><a href="#">荣耀官网</a>|</li>
            
                <li>
                    <span class="flex-container">
                        <a href="#">软件应用</a><h5></h5>|
                    </span>
                </li>
            
                <li><a href="#">花粉俱乐部</a>|</li>
            
                <li><a href="#">Select Region</a></li>
            
            </ul>

            <ul class="right">
               
                <li><a href="#" class="login">登录  </a></li>
            
                <li><a href="#" class="login">注册</a>|</li>
            
                <li><a href="#">我的订单</a>|</li>
            
                <li><a href="#">v码(优购码)</a>|</li>
            
                <li><a href="#">手机版</a>|</li>

                <li>
                    <span class="flex-container">
                        <a href="#">网站导航</a>
                        <h5></h5>
                    </span>
                </li>

            
            </ul>
        </div>
    </div>

    <!-- 头部 header_common-->
     <div class="header_common">
        <div class="wrapper">
            <div class="left">
                <img src="./images/logo.huawei.png" alt="">
                <div class="box">商城首页</div>
            </div>
            <div class="right">
                <img src="./images/qrcode_vmall_app01.png" alt="">
                <div>微信扫码关注我们</div>
            </div>
        </div>
    
    </div>

    <!-- 头部 header -->
     <div class="header">
        <div class="wrapper">
            <div class="nav">
                <ul>
                    <li>
                        <div>全部商品</div>
                    </li>
                    
                </ul>
                <ul>
                    <li>
                        <div>华为专区</div>
                    </li>
                </ul>
                <ul>
                    <li>
                        <div>HUAWEI P10</div>
                    </li>
                </ul>
                <ul>
                    <li>
                        <div>HUAWEI Mate9</div>
                    </li>
                </ul>
                <ul>
                    <li>
                        <div>HUAWEI Nova</div>
                    </li>
                </ul>
                <ul>
                    <li>
                        <div>华为专区</div>
                    </li>
                </ul>
                <ul>
                    <li>
                        <div>华为畅享6S</div>
                    </li>
                </ul>
                <ul>
                    <li>
                        <div>荣耀专区</div>
                    </li>
                </ul>
            </div>
           
        </div>    
        
        
    </div>

    <!-- banner -->
    <div class="banner">
        <div class="wrapper">
            <!-- 图片 -->
            <ul class="pic">
                <li><a href="#"><img src="./images/2017042210305530.jpg" alt=""></a></li>

                <li><a href="#"><img src="./images/2017042210305530.jpg" alt=""></a></li>

                <li><a href="#"><img src="./images/2017042210305530.jpg" alt=""></a></li>

            </ul>
            <div class="subnav">
                <ul>
                    <li>
                        <div>手机</div>
                        <div class="classify"><a href="#">HUAWEI Mate系列</a></div>
                    </li>
                    <li>
                        <div>平板 & 穿戴</div>
                        <div class="classify"><a href="#">平板电脑</a><a>手环/手表</a></div>
                    </li>
                    <li>
                        <div>笔记本电脑</div>
                        <div class="classify"><a href="#">超薄本</a></div>
                    </li>
                    <li>
                        <div>智能家居</div>
                        <div class="classify"><a href="#">子母路由</a><a>电力猫</a><a>路由器</a></div>
                    </li>
                    <li>
                        <div>专属配件</div>
                        <div class="classify"><a href="#">贴膜</a><a>保护壳</a><a>保护套</a></div>
                    </li>
                    <li>
                        <div>通用配件</div>
                        <div class="classify"><a href="#">耳机</a><a>音箱</a></div>
                    </li>
                </ul>
            </div>
            <ol>
                <li class="current">1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
                <li>5</li>
                <li>6</li>
                <li>7</li>

            </ol>
            

        </div>

    </div>

    <!-- 内容 -->
    <div class="bd">
        <div class="wrapper"">
            <ul>
                <li><a href="#"><img src="./images/20170310105644358.jpg" alt=""></a></li>
            
                <li><a href="#"><img src="./images/2017031017165551.jpg" alt=""></a></li>
            
                <li><a href="#"><img src="./images/20170310090516264.jpg" alt=""></a></li>
            
                <li><a href="#"><img src="./images/20170313143419135.jpg" alt=""></a></li>
            
            </ul>
        </div>
    </div>

    <div class="pd">
        <div class="wrapper">
            <div class="pd-container">
                <div class="left">
                        <p class="name">HUAWEI P10 Plus</p>
                        <p class="feature">金属钻雕工艺</p>
                        <p class="price">¥ 4388</p>
                </div>
                <div class="right">
                    <img src="./images/1491476650727.png" alt="">
                </div>
            </div>
            <div class="pd-container">
                <ul class="left">
                    <li>
                        <p class="name">HUAWEI P10 Plus</p>
                        <p class="feature">金属钻雕工艺</p>
                        <p class="price">¥ 4388</p>
                    </li>
                </ul>
                <div class="right">
                    <img src="./images/1484219138436.png" alt="">
                </div>
            </div>
            <div class="pd-container">
                <ul class="left">
                    <li>
                        <p class="name">HUAWEI P10 Plus</p>
                        <p class="feature">金属钻雕工艺</p>
                        <p class="price">¥ 4388</p>
                    </li>
                </ul>
                <div class="right">
                    <img src="./images/1489161234073.png" alt="">
                </div>
            </div>
        </div>
    </div>

    <!-- 底部 -->
    <div class="footer">
        <div class="wrapper">
            <!-- 服务 -->
            <div class="service">
                <ul>
                    <li>
                        <h5></h5>
                
                        <p>500强企业 品质保证</p>
                
                    </li>
                
                    <li>
                        <h5></h5>
                
                        <p>7天退货 15天换货</p>
                
                    </li>
                
                    <li>
                        <h5></h5>
                
                        <p>99元起免运费</p>
                
                    </li>
                
                    <li>
                        <h5></h5>
                
                        <p>448家维修网点 全国联保</p>
                
                    </li>
                
                </ul>

            </div>
    
            <!-- 帮助中心 -->
            <div class="help">
                    <dl>
                    
                        <dt>
                            <h5></h5>
                            帮助中心
                        </dt>
                    
                        <dd><a href="#">购物指南</a></dd>
                
                        <dd><a href="#">配送方式</a></dd>
                
                        <dd><a href="#">支付方式</a></dd>

                        <dd><a href="#">常见问题</a></dd>
                        
                
                    </dl>
                
                    <dl>
                        <dt>
                            <h5></h5> 售后服务
                        </dt>
                
                        <dd><a href="#">保修政策</a></dd>
                
                        <dd><a href="#">退换货政策</a></dd>
                
                        <dd><a href="#">退换货流程</a></dd>

                        <dd><a href="#">保修状态查询</a></dd>

                
                    </dl>
                
                    <dl>
                        <dt>
                            <h5></h5> 技术支持
                        </dt>
                
                        <dd><a href="#">售后网点</a></dd>
                
                        <dd><a href="#">荣耀零售店铺</a></dd>
                
                        <dd><a href="#">预约维修</a></dd>

                        <dd><a href="#">手机寄修服务</a></dd>
                        
                        <dd><a href="#">维修配件价格查询</a></dd>
                        
                        <dd><a href="#">软件下载</a></dd>
                
                    </dl>
                
                    <dl>
                        <dt>
                            <h5></h5> 关于商城
                        </dt>
                
                        <dd><a href="#">售后政策</a></dd>
                
                        <dd><a href="#">退款说明</a></dd>
                
                        <dd><a href="#">取消订单</a></dd>
                
                    </dl>
                
                    <dl>
                        <dt>
                            <h5></h5> 关注我们
                        </dt>
                
                        <dd><a href="#">新浪微博<span class="iconfont icon-customer-service"></span></a></dd>
                
                        <dd><a href="#">腾讯微博</a></dd>
                
                        <dd><a href="#">花粉俱乐部</a></dd>

                        <dd><a href="#">商城手机版</a></dd>

                
                    </dl>
                
            </div>
    
            <!-- 版权 -->
            <div class="copyright">
                <div class="text1">
                    <p>友情链接： | 华为官网 | 华为消费者业务 | 荣耀官网 | 花粉俱乐部 | 莫塞尔商城 | 爱旅官网 | 华为应用市场 | 万表网 | 中商情报网 | 刷机精灵 | 华为手机 | 优购物官网 | 智能电视 | UC浏览器 |</p>
                    <p>中关村商城 | 酷狗音乐 | 华为商城手机版 | 百信手机网 | 卡宝宝网 | 多特软件下载 | 同步助手 | 蜂鸟摄影网 | 奇珀论坛 | 家具商城 | 拍鞋网商城 | 欧宝丽珠宝 | 寻购网 | 亿智蘑菇 | 安卓市场 |</p>
                    <p>阿里巴巴生意经 | 手机大全 | 安卓软件园 | 卓大师刷机 | 智机论坛 | 电子产品世界 | 历趣网 | 网购返利 | Apple110 | 91手机门户网 | 移动叔叔 | 奥特莱斯 | 荣耀Magic | 携程租车 | 
                        <span>申请链接 >></span>
                    </p>
                </div>
                <div class="text2">
                    <p>隐私政策 服务协议 Copyright ? 2012-2017 VMALL.COM 版权所有 保留一切权利</p>
                    <p>
                        <span><img src="./images/20160226162651249.png" alt=""></span>
                        公安备案 苏公网安备 32011402010009号 | 苏ICP备09062682号-9 | 增值电信业务经营许可证：苏B2-20130048 | 网络文化经营许可证：苏网文[2015] 1599-026号</p>
                </div>
                <div class="pic">
                    <img src="./images/20161224180914742.jpg" alt="">
                    <img src="./images/20160226162415360.png" alt="">
                    <img src="./images/20160226162521265.png" alt="">
                    <img src="./images/20160226162531395.png" alt="">
                </div>
            </div>
            <div>

            </div>
    
        </div>
    
    </div>


</body>
</html>